<template>
    <view class="user-info">
        <image src="/static/logo.png" class="avatar"></image>
        <view class="uid">UID: {{ uid }}</view>
    </view>
    <!-- 个人数据部分 -->
    <view class="container">
        <view class="personal-data">
            <view class="data-item">
                <text class="label">我的排名</text>
                <text class="value">0000.00</text>
            </view>
            <view class="data-item">
                <text class="label">我的积分</text>
                <text class="value">0000</text>
            </view>
            <view class="data-item">
                <text class="label">有效直推/我的直推</text>
                <text class="value">0000.00/0000</text>
            </view>
            <view class="data-item">
                <text class="label">我的学习力</text>
                <text class="value">0000</text>
            </view>
        </view>
        <!-- 我的团队部分 -->
        <view class="my-team">
            <view class="team-item">
                <text class="label">有效成员/团队成员</text>
                <text class="value">0000/0000</text>
            </view>
            <view class="team-item">
                <text class="label">团队学习力</text>
                <text class="value">0000</text>
            </view>
        </view>
    </view>
    <!-- 修改资料模态框 -->
    <view class="edit-profile-modal" v-if="showEditProfileModal">
        <view class="modal-content">
            <view class="modal-header">
                <text class="modal-title">请输入新姓名</text>
            </view>
            <view class="modal-body">
                <input type="text" v-model="newNameInputValue" placeholder="请输入新姓名" />
            </view>
            <view class="modal-footer">
                <button @click="cancelEditProfile">取消</button>
                <button @click="confirmEditProfile">确定</button>
            </view>
        </view>
    </view>
    <!-- 功能按钮部分 -->
    <view class="function-buttons">
        <button @click="handleAnswerScore">答题领积分</button>
        <button @click="handleVersionInfo">版本号信息</button>
        <button @click="handleEditProfile">修改资料</button>
        <button @click="addintegral">增加积分</button>
        <button @click="handleLogout">退出登录</button>
    </view>
</template>

<script>
export default {
    data() {
        return {
            showEditProfileModal: false,
            newNameInputValue: '',
            uid: '', // 初始化UID
        };
    },
    onLoad(options) {
        this.fetchUidFromToken();
        // 检查URL参数中是否有method字段
        if (options.method && options.method === 'handleEditProfile') {
            this.handleEditProfile();
        }
    },
    methods: {
        handleAnswerScore() {
            uni.navigateTo({
                url: '/pages/index/index/studylist/studylist'
            });
        },

        // 添加积分
        addintegral() {
            uni.navigateTo({
                url: '/pages/index/my/addintegral/addintegral'
            });
        },
        handleEditProfile() {
            uni.showModal({
                title: '修改姓名',
                content: '',
                editable: true,
                placeholderText: '请输入新姓名',
                success: async (res) => {
                    if (res.confirm) {
                        const newName = res.content.trim();
                        if (newName) {
                            try {
                                const token = await this.getTokenFromFile();
                                await this.sendNameToServer(newName, token);
                                uni.showToast({
                                    title: '姓名修改成功',
                                    icon: 'success',
                                    duration: 2000
                                });
                            } catch (error) {
                                uni.showToast({
                                    title: error.message || '修改失败，请重试',
                                    icon: 'none',
                                    duration: 2000
                                });
                            }
                        } else {
                            uni.showToast({
                                title: '姓名不能为空',
                                icon: 'none',
                                duration: 2000
                            });
                        }
                    }
                }
            });
        },
        sendNameToServer(tickname, token) {
            uni.request({
                url: 'http://106.15.182.86:9099/studyname',
                method: 'POST',
                data: {
                    tickname: tickname
                },
                header: {
                    'Authorization': token,
                    'Content-Type': 'application/json'
                },
                success: (res) => {
                    if (res.statusCode === 200) {
                        uni.showToast({
                            title: '姓名修改成功',
                            icon: 'success',
                            duration: 2000
                        });
                    } else {
                        uni.showToast({
                            title: '姓名修改失败',
                            icon: 'none',
                            duration: 2000
                        });
                    }
                },
                fail: () => {
                    uni.showToast({
                        title: '网络错误',
                        icon: 'none',
                        duration: 2000
                    });
                }
            });
        },
        getTokenFromFile() {
            const token = uni.getStorageSync('token');
            if (!token) {
                throw new Error('Token not found');
            }
            return token;
        },
        handleLogout() {
            uni.navigateTo({
                url: '/pages/login/login'
            });
        },
        async fetchUidFromToken() {
            try {
                const token = await this.getTokenFromFile();
                const [err, response] = await uni.request({
                    url: 'http://106.15.182.86:9099/studystatus',
                    method: 'GET',
                    header: {
                        'Authorization': token,
                        'Content-Type': 'application/json'
                    }
                });
                if (response && response.statusCode === 200) {
                    const data = response.data;
                    this.uid = data.message[0].uid; // 将获取到的uid赋值给组件的uid属性
                    console.log('UID:', this.uid);
                } else {
                    uni.showToast({
                        title: '获取UID失败',
                        icon: 'none',
                        duration: 2000
                    });
                }
            } catch (error) {
                uni.showToast({
                    title: error.message || '网络错误',
                    icon: 'none',
                    duration: 2000
                });
            }
        }
    }
};
</script>

<style scoped>
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.header {
  width: 100%;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background-color: #f8f8f8;
  border-bottom: 1px solid #e5e5e5;
}

.user-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
}

.avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
}

.uid {
  font-size: 14px;
  color: #666;
  margin-top: 10px;
}

.personal-data,
.my-team {
  width: 90%;
  padding: 15px;
  box-sizing: border-box;
  border-radius: 8px;
  background-color: pink;
  margin-top: 20px;
  justify-content: center;
}

.data-item,
.team-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.label {
  font-size: 16px;
  color: #333;
}

.value {
  font-size: 18px;
  color: #ff557a;
}

.function-buttons {
  margin-top: 20px;
  width: 100%;
  background-color: transparent;
  border-color: transparent;
}
</style>